﻿<%@ Page Language="C#" %>
<%@ Register Assembly="MattBerseth.WebControls.AJAX" Namespace="MattBerseth.WebControls.AJAX.Progress" TagPrefix="mb" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Upload file</title>
    <link rel="Stylesheet" href="../_assets/css/progress.css" />
    <link rel="Stylesheet" href="../_assets/css/upload.css" />
    <style type="text/css">
        BODY{ font-family:Arial, Sans-Serif; font-size:12px;}
    </style>
    <script type="text/C#" runat="server">
       
        public string RID { set; get; }
        public string FJID { set; get; }
        public string filetype { set; get; }
        protected void Page_Load(object sender, EventArgs args)
        {
            if (!this.IsPostBack)
            {                
                this.Session["UploadInfo"] = new UploadInfo { IsReady = false };
                
            }
            if (Request.QueryString["RID"] != null)
                RID = Request.QueryString["RID"].ToString();
            if (Request.QueryString["FJID"] != null)
                FJID = Request.QueryString["FJID"].ToString();
            if (Request.QueryString["filetype"] != null)
                filetype = Request.QueryString["filetype"].ToString();
        }
        
        /// <summary>
        /// 
        /// </summary>
        [System.Web.Services.WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public static object GetUploadStatus()
        {
            //获取文件长度
            UploadInfo info = HttpContext.Current.Session["UploadInfo"] as UploadInfo;

            if (info != null && info.IsReady)
            {
                int soFar = info.UploadedLength;
                int total = info.ContentLength;

                int percentComplete = (int)Math.Ceiling((double)soFar / (double)total * 100);
                string message = string.Format("upload {0} ... {1} of {2} byte", info.FileName, soFar, total);
                
                //  返回百分比
                return new { percentComplete = percentComplete, message = message };
            }

            //  还没有准备好...
            return null;
        }
    
    </script>

    <style type="text/css">
    .button{background:transparent url(../images/newimg/button_bg.png) no-repeat scroll 0 0; width:62px; height:23px; border:none; color:White; font-weight:bold;  cursor:pointer; margin:0 0 0 0;}    
    </style>
</head>
<body  onbeforeunload="LeaveWin()">
    <form id="form1" runat="server">
    <asp:ScriptManager ID="scriptManager" runat="server" EnablePageMethods="true" />
    
    <script type="text/javascript">

        function LeaveWin() {
            window.opener.location = window.opener.location;
        } 
        var intervalID = 0;
        var progressBar;
        var fileUpload;
        var form;

        

        // 进度条      
        function pageLoad(){           
            $addHandler($get('upload'), 'click', onUploadClick);
            progressBar = $find('progress');
        }
        // 注册表单       
        function register(form, fileUpload){            
            this.form = form;
            this.fileUpload = fileUpload;
        }        
        //上传验证
        function onUploadClick() {        
            var vaild = fileUpload.value.length > 0;
            if(vaild){              
                $get('upload').disabled = 'disabled';             
                updateMessage('info', 'Initialization upload...');                
                //提交上传
                form.submit();                
                // 隐藏frame
                Sys.UI.DomElement.addCssClass($get('uploadFrame'), 'hidden');
                // 0开始显示进度条
                progressBar.set_percentage(0);
                progressBar.show();           
                // 上传过程
                intervalID = window.setInterval(function(){
                    PageMethods.GetUploadStatus(function(result){
                        if(result){
                            //  更新进度条为新值
                            progressBar.set_percentage(result.percentComplete);
                            //更新信息
                            updateMessage('info', result.message);
                            
                            if(result == 100){
                                // 自动消失
                                window.clearInterval(intervalID);                        
                            }
                        }
                    });
                }, 500);                
            }
            else{
                onComplete('error', 'You must select a file');
            }
        }       
    
        function onComplete(type, msg){
            // 自动消失
            window.clearInterval(intervalID);
            // 显示消息
            updateMessage(type, msg);
            // 隐藏进度条
            progressBar.hide();
            progressBar.set_percentage(0);
            // 重新启用按钮
            $get('upload').disabled = '';
            //  显示frame
            Sys.UI.DomElement.removeCssClass($get('uploadFrame'), 'hidden');
        }        
        function updateMessage(type, value){
            var status = $get('status');
            status.innerHTML = value;
            // 移除样式
            status.className = '';
            Sys.UI.DomElement.addCssClass(status, type);
        }
    
    </script>
    
    <div>
        <div class="upload">
            <h3>Upload file</h3>
            <div>
                <iframe id="uploadFrame" frameborder="0" scrolling="no" src="Upload.aspx"></iframe>
                <mb:ProgressControl ID="progress" runat="server" CssClass="lightblue" style="display:none" Value="0" Mode="Manual" Speed=".4" Width="100%" />
                <div>
                    <div id="status" class="info">Please choose to upload files</div>
                    <div class="commands">
                        <input id="upload" type="button"  class="button" value="Upload" /> 
                    </div>
                </div>
            </div>
        </div> 
      
    </div>
    </form>
    <script type="text/jscript">
        document.getElementById("uploadFrame").src = "Upload.aspx?RID=<%=RID %>&FJID=<%=FJID %>&filetype=<%=filetype %>";
    </script>
</body>
</html>
